<template>
    <div id="GerritReviewDetail">
        <div>
            <h1 class="text-success">需求实现详情页</h1>
        </div>
        <hr>
        <div >
            <h2 class="text-success">{{dateChange}}</h2>
        </div>

        <div class="row">
            <div class="col-lg-12">
                <DataTable :table_id="tableinfo_ri.id" :table_title="tableinfo_ri.title" :columns="tableinfo_ri.columns" 
                    :table_data='tableinfo_ri.table_data' :columns_key="tableinfo_ri.columns_key" :columnDefs="tableinfo_ri.columnDefs">  
                </DataTable>
            </div>
        </div>
        
    </div>
</template>
<script>
import DataTable from '@/components/qa/DataTable.vue'
export default {
    name: 'GerritReviewDetail',
    components: {
        DataTable,
    },
    props: {
        
    },
    data() {
        return {
            tableinfo_ri: {
                id: 'table_cc',
                title: '需求实现情况',
                columns: ['序号', '编号', '优先级', '需求名称','状态', '操作'],
                table_data: [],
                columns_key: [
                    {data: 'r_reqid'},
                    {data: 'r_codeid'},
                    {data: 'r_priority'},
                    {data: 'r_name'},
                    {data: 'r_status'}
                ],
                columnDefs: [
                    {
                        targets: 5,
                        width: '10%',
                        // eslint-disable-next-line 
                        render: [],
                    }
                ],
            },
            dateChange: '',
            project_id: '', 
            pid: '',
            stage: '',
            status: '',
        }
    },
    created: function() {
        this.dateChange = this.$route.params.date;
        this.project_id = this.$route.params.pmsProjectId;
        this.pid = this.$route.params.pid;
        this.stage = this.$route.params.select1;
        this.status = this.$route.params.select2;
        // console.log(param);
        // console.log(param1)
        // this.param = param;
    },
    watch: {
        "tableinfo_nocomments.table_data": {
            handler: function() {
                
            },
            deep: true,
        },
    },
    methods: {
        getReqImplement: function(project, pid) {
            this.$axios.get('/api/qa/getreqimplement/?project='+project+'&pid='+pid)
                .then((response) => {
                    if (response.status == 200) {
                        // eslint-disable-next-line
                        console.log(response.data.requirement);
                        // this.level_info = this.level_info.push.apply(this.level_info,response.data.requirement);
                        // console.log(this.level_info);
                        this.tableinfo_ri.table_data = response.data.requirement
                    }
                })
                .catch(function(err) {
                    // eslint-disable-next-line
                    console.log(err);
                });
        },
        // // eslint-disable-next-line     
        render_ri: function(data, type, row, meta) {
            // eslint-disable-next-line     
            var daterange = this.dateChange;
            var pid = row.r_reqid
            var stage = 'test';
            var status = 'test';
            var child = row.r_child;
            if (child) {
                return '<a href="#/project/'+this.project_id +'/qa/requireimplementdetail/'+daterange+'&'+pid+'&'+stage+'&'+status+
                '" class="btn btn-sm btn-primary" target="_blank">查看子需求</a>';
            } else {
                return ''
            }
        },
    },
    mounted: function() {
        var after = this.dateChange.substring(0,10);
        var before = this.dateChange.substring(13);
        var mode = this.mode
        this.tableinfo_ri.columnDefs[0].render = this.render_ri;
        this.getReqImplement(this.project_id, this.pid)     
    }
}
</script>
